//
// import { login, logout, getInfo } from '@/api/user'
// import { getToken, setToken, removeToken } from '@/utils/auth'
import { resetRouter } from '@/router'

import { login, getUserInfo, getUserDetailById } from '@/api/user'
// import { reject } from 'core-js/fn/promise'
import { getToken, setToken, removeToken } from '@/utils/auth'
// import { reject, resolve } from 'core-js/fn/promise'

export default {
  // 开启模块命名空间，才算是严格的模块化管理
  // 访问 mutation 等函数的时候 都需要在前面加上模块名称才可以
  namespaced: true,
  // 为什么用箭头函数
  // data(){return{响应式数据}} 是为了复用的时候，如果直接写成对象
  // 由于引用类型的特性
  // 各个组件之间共享data中的数据的 组件一个反生改变另一个也会受到影响

  // 改成函数trturn对象之后 每一次组件复用的时候都会重新执行以下这个函数
  // 每次返回的都是一个全新的对象，也就是每一个复用的组件 都用于一份自己独立的数据， 互不影响

  // vuex中的模块也是可以进行复用的 为了复用的时候 回想不影响
  // 采用同样的函数执行 return对象的形式
  state: () => ({
    // 先从本地cookie获取
    token: getToken() || '',
    userInfo: {}
    // name: ''
    // info: {
    //   msg: {
    //     title: 'this is title'
    //   }
    // }
  }),
  // state: {
  //   name: 'cp'
  // },
  mutations: {
    setToken(state, payload) {
      // 存入vuex
      state.token = payload
      // 存入本地cookie中
      setToken(payload)
    },
    setUserInfo(state, userInfo) {
      state.userInfo = userInfo
    },
    // 清除用户数据
    removeUserInfo(state) {
      // 清空数据
      state.token = ''
      state.userInfo = {}
      // 调用清空token的方法
      removeToken()
      // 重置路由
      resetRouter()
    }
    // 测试用
    // setName(state, val) {
    //   state.name = val
    // }

  },
  actions: {
    asyncSetToken(ctx, data) {
      // 发送登录请求 获取 token 然后调用 mutation 遁入 state
      // 基础原理： 在promise链中 如果前一个.then方法中return了 new promise 对象
      // 那么后一个.then的回调 会等到new promise对象状态发生变化之后才会执行
      return new Promise((resolve, reject) => {
        login(data).then(res => {
          console.log(res)
          // res.data 拿到 token数据
          ctx.commit('setToken', res.data)
          // 成功返回后
          resolve()
        })
      })
    },
    asyncGetUserInfo(ctx) {
      return new Promise((resolve, reject) => {
        // 1 调用获取个人信息接口
        getUserInfo().then(res => {
          // console.log(res.data)
          getUserDetailById(res.data.userId).then(imgRes => {
            ctx.commit('setUserInfo', { ...res.data, ...imgRes.data })
            // 2 拿到数据之后通过调用mutation函数把信息存入state
            // resolve()
            resolve({ ...res.data, ...imgRes.data })
          })
        })
      })
    }
    // 测试代码
    // asyncSetName(store, data) {
    //   return new Promise((resolve, reject) => {
    //     setTimeout(() => {
    //       store.commit('setName', data)
    //       // 成功返回后
    //       resolve()
    //     }, 3000)
    //   })
    // }
  }
}

